import './public-path';
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import Repos from './views/repos';
import About from './views/about';
import {BrowserRouter, Route, Link} from 'react-router-dom';

function render(props) {
  const { container } = props;
  ReactDOM.render(
	<BrowserRouter basename={window.__POWERED_BY_QIANKUN__ ? '/sub-react' : '/'}>
		<React.StrictMode>
		<div>
			<Link to="/about">About</Link> |
			<Link to="/repos">Repos</Link> |
		</div>
		<div>
			<Route path="/" exact component={App}/>
			<Route path="/repos" component={Repos}/>
			<Route path="/about" component={About}/>
		</div>
		</React.StrictMode>
	</BrowserRouter>, 
	container ? container.querySelector('#root') : document.querySelector('#root'));
}

if (!window.__POWERED_BY_QIANKUN__) {
  render({});
}

export async function bootstrap() {
  console.log('[react16] react app bootstraped');
}

export async function mount(props) {
  console.log('[react16] props from main framework', props);
  render(props);
}

export async function unmount(props) {
  const { container } = props;
  ReactDOM.unmountComponentAtNode(container ? container.querySelector('#root') : document.querySelector('#root'));
}
